<template>
	<z-paging ref="paging" v-model="dataList" @query="queryList" safe-area-inset-bottom>
	<view class="content p15" style="margin-bottom: 60rpx;">
		<view v-for="(item,index) in dataList" :key="index" @click="desc(item.id)">
		<view class="title f12">{{item.riqi}}</view>
		<view class="card">
			<view class="flexb">
				<view class="cen">
					<view class="f14 color55">开始时间</view>
					<view style="margin-top: 20rpx;font-size: 46rpx;">{{item.start_time}}</view>
				</view>
				<view class="bold">——</view>
				<view class="cen">
					<view class="f14 color55">结束时间</view>
					<view style="margin-top: 20rpx;font-size: 46rpx;">{{item.end_time}}</view>
				</view>
				<view class="cen" style="color: #4C7BAE;">
					<view>问题</view>
					<view style="margin-top: 20rpx;font-size: 46rpx;font-weight: bold;">{{item.q_num}}</view>
				</view>
			</view>
			<view class="flexb">
				<view class="flex">
					<image class="icon" src="../../static/icon/shijian.png" mode="aspectFill"></image>
					<view class="f14 color55">
						{{item.duration}}
					</view>
				</view>
				<view class="flex">
					<image class="icon"  src="../../static/icon/dizhi.png" mode="aspectFill"></image>
					<view class="f14 color55">
						{{item.licheng}}公里
					</view>
				</view>
			</view>
		</view>
		</view>
	</view>
	</z-paging>
</template>

<script>
	import helper from '../../common/helper.js';
	import api from '../../common/api.js';
	export default {
		data() {
			return {
				list:[],
				dataList: [],
				quesForm: {
					pageNum: '',
					pageSize: 10
				},
			}
		},
		onLoad() {
		},
		methods: {
			queryList(pageNo, pageSize) {
				let self = this;
				self.quesForm.pageNum = pageNo
				self.quesForm.pageSize = pageSize
				api.xc_jilu(self.quesForm).then((res) => {
					console.log('res', res)
					this.$refs.paging.complete(res.data);
				}).catch((err) => {
					console.log('err', err)
					this.$refs.paging.complete(false);
				})
			},
			desc(id){
				uni.navigateTo({
					url:'/pages/taxiService/order?id='+id
				})
			}
		}
	}
</script>

<style scoped>
	page {
		background-color: #EEF8FE;
	}

	.title {
		margin-top: 20rpx;
	}

	.card {
		box-shadow: 0rpx 0rpx 12rpx 4rpx #d1eeff;
		border-radius: 20rpx;
		padding: 30rpx;
		margin-top: 20rpx;
		background-color: #ffffff;
	}

	.color55 {
		color: #55535C;
	}

	.adress {
		border-top: 2rpx dashed #55535C;
		height: 74rpx;
		line-height: 74rpx;
		margin-top: 20rpx;
	}

	.icon {
		width: 40rpx;
		height: 40rpx;
		margin-right: 12rpx;
	}
</style>
